<template>
    <div>
        <el-form :model="form" :rules="rules" ref="form" v-loading="loading">
            <el-form-item prop="username" label="用户名" label-width="80px">
                <el-input v-model="form.username" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item prop="grade" label="权限" label-width="80px">
                <el-checkbox-group v-model="checkList">
                    <el-checkbox :label="1">系管理</el-checkbox>
                    <el-checkbox :label="2">专业管理</el-checkbox>
                    <el-checkbox :label="4">班级管理</el-checkbox>
                    <el-checkbox :label="8">学生管理</el-checkbox>
                    <el-checkbox :label="16">教师管理</el-checkbox>
                    <el-checkbox :label="32">课程管理</el-checkbox>
                    <el-checkbox :label="64">选课修改</el-checkbox>
                    <el-checkbox :label="128">管理员管理</el-checkbox>
                </el-checkbox-group>
            </el-form-item>
            <el-form-item prop="password" label="密码" label-width="80px">
                <el-input v-model="form.password" autocomplete="off" type="password"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer" style="display: flex; justify-content: flex-end;">
            <el-button @click="cancel">取 消</el-button>
            <el-button type="primary" @click="submit">确 定</el-button>
        </div>

    </div>
</template>

<script>
import { adminEdit, adminInfo } from '@/api/admin/admin';
export default {
    props: ["editId"],
    data() {
        return {
            form: {
                id: -1,
                password: "",
                username: "",
                privilege: 0
            },
            checkList: [],
            loading: false,
            rules: {
                username: [
                    { required: true, message: "请输入用户名", trigger: 'blur' }
                ]
            }
        }
    },
    methods: {
        getList() {
            this.loading = true
            adminInfo(this.editId).then(res => {
                if (res.code === 0) {
                    // console.log(res)
                    this.form = res.data
                    for (let bit = 0; bit < 8; bit++) {
                        const power = 1 << bit;
                        if ((power & res.data.privilege) === power) {
                            // console.log(power);
                            this.checkList.push(power);
                        }
                    }

                }
            }).finally(() => {
                this.loading = false
            })
        },
        submit() {
            // console.log(this.form)
            this.$refs["form"].validate(f => {
                if (f) {
                    if (this.checkList.length > 0) {
                        this.form.privilege = this.checkList.reduce((prev, cur) => {
                            return prev + Number(cur)
                        }, 0)
                    }

                    adminEdit(this.form).then(res => {
                        // console.log(res)
                        if (res.code === 0) {
                            this.$message({
                                type: "success",
                                message: res.data
                            })
                            this.$emit("close")
                        }
                    })
                }
            })
        },
        cancel() {
            this.$emit("cancelAdd")
        }
    },
    mounted() {
        this.getList()
    }
}
</script>

<style lang="scss" scoped></style>